<template>
  <div>
    <View3d :graphData="allRelations" :colors=colors :types=types v-if="allRelations"></View3d>
  </div>
</template>

<script>
import { get_all_relations } from '@/network/api/graph'
import View3d from '@/components/View3d.vue'
export default {
  components: {
    View3d
  },
  data() {
    return {
      allRelations: null,
      colors: ['#5470c6', '#91cc75', '#FFB6C1', '#ee6666'],
      types: ['魏国', '蜀国', '吴国', '群雄']
    }
  },
  methods: {
    async getAllRelations() {
      const res = await get_all_relations()
      this.allRelations = this.parserData(res)
    },
    parserData(data) {
      if (!data) return console.log('数据为空')
      const nodes = data.data
      nodes.forEach((item, index) => {
        item.id = index
      });
      const newValue = {
        nodes: nodes,
        links: data.links
      }
      return newValue
    },
  },
  mounted() {
    this.getAllRelations()
  },
}
</script>

<style scoped>

</style>

